<template>
  <div class="equipmentOption">
    <div class="equipmentOption_treeBg">
      <MetaTreeList title-size="18" title="设备" :default-props="defaultProps" :tree-data="equTreeData" @treeItemChoose="roloeItemChoose"></MetaTreeList>

      <!-- <MetaChoiceList
        ref="equipmentOption_list"
        title="设备"
        title-btn=""
        :list-data="equipDataStr"
        @roloeItemChoose="roloeItemChoose"
        :treeBtn="choiceListTreeBtn"
      /> -->
    </div>
    <div class="equipmentOption_infoBg">
      <div class="equipmentOption_info">
        <div v-if="Object.keys(roleInfoItem).length > 0" class="equipmentO_rightArea">
          <div class="equipmentO_infoTitleBg">
            <div class="equipmentO_infoTitle">设备信息</div>
          </div>
          <el-form
            ref="roleInfo"
            :model="roleInfoItem"
            label-width="120px"
            size="mini"
            label-position="left"
            class="equipmentO_info"
          >
            <el-row>
              <el-col :span="8">
                <el-form-item label="用户设备名称">
                  <el-col class="equipmentO_infoLabel">{{ roleInfoItem.customizeName && roleInfoItem.customizeName !== '' ? roleInfoItem.customizeName : roleInfoItem.equipmentname }}</el-col>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="设备名称">
                  <el-col class="equipmentO_infoLabel">{{ roleInfoItem.alias }}</el-col>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="设备sn号">
                  <el-col class="equipmentO_infoLabel">{{ roleInfoItem.snid }}</el-col>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="可见光积分">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="0" v-model="roleInfoItem.equ_visible_light_integral" :precision="0"></el-input-number> ms
                    <!-- {{ roleInfoItem.visible_light_integral ? roleInfoItem.visible_light_integral : '0' }}ms -->
                  </el-col>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="补光灯电压">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="1.5" :max="5" v-model="roleInfoItem.equ_fill_lamp_voltage" :precision="1"></el-input-number> V
                    <!-- {{ roleInfoItem.fill_lamp_voltage ? roleInfoItem.fill_lamp_voltage : '0' }}V -->
                  </el-col>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="短波积分">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="0" v-model="roleInfoItem.equ_shot_wave_integral" :precision="0"></el-input-number> ms
                    <!-- {{ roleInfoItem.shot_wave_integral ? roleInfoItem.shot_wave_integral : '0' }}ms -->
                  </el-col>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="设置增益">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="0" :max="6" v-model="roleInfoItem.equ_data_value_gain" :precision="0"></el-input-number> 倍
                    <!-- {{ roleInfoItem.data_value_gain ? roleInfoItem.data_value_gain : '0' }}倍 -->
                  </el-col>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="采集密度">
                  <el-col class="equipmentO_infoLabel">
                    {{ roleInfoItem.acquisition_density ? roleInfoItem.acquisition_density : '0' }}次
                  </el-col>
                </el-form-item>
              </el-col> -->
              <el-col :span="8">
                <el-form-item label="设置偏压">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="0" v-model="roleInfoItem.equ_power_supply_bias" :precision="0"></el-input-number> mv
                    <!-- {{ roleInfoItem.power_supply_bias ? roleInfoItem.power_supply_bias : '0' }}mv -->
                  </el-col>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="设备单次运行采集次数">
                  <el-col class="equipmentO_infoLabel">
                    <el-input-number size="mini" :step="1" :min="0" :max="20" v-model="singleTimes" :precision="0" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-input-number>
                  </el-col>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="光源开关">
                  <div class="equipmentO_formItem">
                    <img v-if="roleInfoItem.light_source && roleInfoItem.light_source == '1'" src="@/assets/equipment/side_light_o.png">
                    <img v-else src="@/assets/equipment/side_light.png">
                    <el-input-number size="mini" :step="1" :min="0" v-model="seconds" :precision="1" style="margin-left: 8px"></el-input-number>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="开启电磁锁">
                  <el-button type="danger" icon="el-icon-unlock" circle @click="openElLock"></el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="equipmentO_infoTitleBg">
            <div class="equipmentO_infoTitle">设备操作</div>
            <el-button v-if="stopBtnStatus()" type="danger" class="equipmentO_delBtn" plain size="mini" @click="stopCollect">停止</el-button>
          </div>
          <div class="equipmentO_eOptionArea">
            <div class="equipmentO_eOptionAreaBg">
              <!-- <div class="equipmentO_eImgArea" @click="equipInfo()"> -->
              <div class="equipmentO_eImgArea" @click="equipInfo()">
                <img v-if="roleInfoItem.equipment_type == '1'" src="@/assets/equipment/equipment_f.png">
                <img v-else-if="roleInfoItem.equipment_type == '2'" src="@/assets/equipment/equipment_m.png">
                <img v-else-if="roleInfoItem.equipment_type == '3'" src="@/assets/equipment/equipment_s.png">
              </div>
              <div class="equipmentO_option">
                <el-row :gutter="12" class="equipmentO_optionRow">
                  <el-col :span="8">
                    <el-card shadow="hover" :class="settingFlag ? 'equipmentO_optionCard cardBg_o' : 'equipmentO_optionCard'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg" @click="doEquipParamsSetting()">设备参数配置</div>
                    </el-card>
                  </el-col>
                  <el-col :span="8">
                    <el-card shadow="hover" :class="roleInfoItem.dark && roleInfoItem.dark == '1' ? 'equipmentO_optionCardWhole cardBg_o' : 'equipmentO_optionCardWhole'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg">
                        <div class="equipmentO_optionCardTitle" @click="doEquipOption('adl')">暗电流定标</div>
                        <div class="equipmentO_optionCardOption">
                          <el-input-number size="mini" :step="1" :min="0" :max="200" v-model="adlTimes" :precision="0" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-input-number>
                        </div>
                      </div>
                    </el-card>
                  </el-col>
                  <el-col :span="8">
                    <el-card shadow="hover" :class="roleInfoItem.reference && roleInfoItem.reference == '1' ? 'equipmentO_optionCardWhole cardBg_o' : 'equipmentO_optionCardWhole'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg">
                        <div class="equipmentO_optionCardTitle" @click="doEquipOption('bzb')">标准版定标</div>
                        <div class="equipmentO_optionCardOption">
                          <el-input-number size="mini" :step="1" :min="0" :max="200" v-model="bzbTimes" :precision="0" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-input-number>
                        </div>
                      </div>
                    </el-card>
                  </el-col>
                </el-row>
                <el-row :gutter="12" class="equipmentO_optionRow">
                  <el-col :span="24">
                    <el-card shadow="hover" :class="roleInfoItem.sample && roleInfoItem.sample == '1' ? 'equipmentO_optionCard cardBg_o' : 'equipmentO_optionCard'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg" @click="doEquipOption('dc')">样品采集</div>
                    </el-card>
                  </el-col>
                  <!-- <el-col :span="12">
                    <el-card shadow="hover" :class="roleInfoItem.continuity && roleInfoItem.continuity == '1' ? 'equipmentO_optionCard cardBg_o' : 'equipmentO_optionCard'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg" @click="doEquipOption('lx')">连续采集</div>
                    </el-card>
                  </el-col> -->
                </el-row>
                <el-row :gutter="12" class="equipmentO_optionRow">
                  <el-col :span="24">
                    <el-card shadow="hover" :class="roleInfoItem.timing && roleInfoItem.timing == '1' ? 'equipmentO_optionCardWhole cardBg_o' : 'equipmentO_optionCardWhole'" :body-style="{padding: 0}">
                      <div class="equipmentO_optionCardBg">
                        <div class="equipmentO_optionCardTitle" @click.stop="doEquipOption('ds')">定时采集</div>
                        <div class="equipmentO_optionCardOption">
                          <div class="equipmentO_optionCardOptionRowUp">
                            <el-date-picker class="equipmentO_optionCardOptionCol" v-model="startTime" type="datetime" placeholder="请选择开始时间" value-format="yyyy-MM-dd HH:mm:ss" size="mini" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-date-picker>
                            <el-input-number class="equipmentO_optionCardOptionCol" size="mini" :step="1" :min="1" v-model="roleInfoItem.timing_interval" :precision="0" style="margin-left: 15px;margin-right: 5px;" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-input-number>min
                          </div>
                          <div class="equipmentO_optionCardOptionRowDown">
                            <el-select class="equipmentO_optionCardOptionCol" v-model="kind" size="mini" placeholder="采集类型" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'">
                              <el-option label="连续采集" value="lx"></el-option>
                              <el-option label="设置次数" value="cs"></el-option>
                            </el-select>
                            <el-input-number class="equipmentO_optionCardOptionCol" v-if="kind === 'cs'" size="mini" :step="1" :min="1" v-model="times" :precision="0" style="margin-left: 15px;margin-right: 5px" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'"></el-input-number>{{kind === 'cs' ? '次' : ''}}
                            <el-select  v-if="kind === 'lx'" class="equipmentO_optionCardOptionCol" v-model="cjModel" size="mini" placeholder="采集模式" :disabled="roleInfoItem.timing && roleInfoItem.timing == '1'" style="margin-left: 15px;margin-right: 5px">
                              <el-option label="休眠模式" value="01"></el-option>
                              <el-option label="持续工作模式" value="00"></el-option>
                            </el-select>
                          </div>
                        </div>
                      </div>
                    </el-card>
                  </el-col>
                </el-row>
              </div>
            </div>
          </div>
          <div v-if="dnChart" class="equipmentO_infoTitleBg">
            <div class="equipmentO_infoTitle">dn值 / 反射率</div>
          </div>
          <div class="equipmentO_chartBg" :style="dnChart ? 'background: #1A232c;' : ''">
            <div class="equipmentO_chartItem">
              <div ref="dnChart" class="equipmentO_originalParamChart"></div>
            </div>
            <div class="equipmentO_chartItem">
              <div ref="reflectivityChart" class="equipmentO_originalParamChart"></div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 单次采集备注 ldc -->
    <el-dialog
      v-if="dcRemarkFlag"
      title="添加备注（选填）"
      :visible.sync="dcRemarkFlag"
      width="50%"
      modal
      center
      :close-on-click-modal="false"
      :close-on-press-escape="false">
      <el-input v-model="dcRemark" placeholder="请输入备注"></el-input>
      <div class="dialogFooter">
        <el-button size="mini" @click="dcRemarkFlag = false">取消</el-button>
        <el-button
          type="primary"
          size="mini"
          @click="doDCCollect()"
        >采集</el-button>
      </div>
    </el-dialog>
  </div>
</template>


<script>
import MetaChoiceList from '../components/MetaChoiceList'
import MetaTreeList from '../components/MetaTreeList'
import deepClone from '../utils/deepClone'
import utils from '../utils/utils'
export default {
  name: 'equipmentOption',
  components: {
    MetaChoiceList,
    MetaTreeList
  },
  data () {
    return {
      roleInfoItem: {},
      equipData: [],
      equipDataStr: '',
      kind: 'lx',
      choiceListTreeBtn: {
        ifEdit: false,
        ifDelete: false
      },
      ws: null,
      username: '',
      seconds: 2,
      singleTimes: 10,
      adlTimes: 100,
      bzbTimes: 100,
      times: 1,
      cjModel: '01',
      dnChart: null,
      startTime: '',
      reflectivityChart: null,
      realEquipmentList: [],
      dcRemarkFlag: false,
      dcRemark: '',
      equipParam: {},
      settingFlag: false,
      defaultProps: {
        children: 'list',
        label: 'name'
      },
      equTreeData: [],
    }
  },
  created() {
    this.initWebsocket()
  },
  mounted() {
    this.initEquipmentData()
  },
  destroyed() {
    if(this.ws) {
      this.ws.close()
      this.ws = null
    }
  },
  methods: {
    initWebsocket() {
      let _this = this
      _this.username = localStorage.getItem('username')
      if ('WebSocket' in window) {
        // 打开一个 web socket
        let ws = new WebSocket(process.env.PROGOO_SOCKET + `ws/${_this.username}`)
        _this.ws = ws
        // let ws = new WebSocket(`ws://39.98.121.176:32766/?${key}&${time}`);
        ws.onopen = function() {
          // Web Socket 已连接上，使用 send() 方法发送数据
          _this.$message({
            message: '设备通讯连接成功',
            type: 'success'
          });
        }
        ws.onmessage = function(evt) {
          try {
            let msg = JSON.parse(evt.data)
            _this.websocketMsgHandle(msg)
          } catch (error) {
            console.log('不是个json对象')
          }
        }
        ws.onclose = function() {
          // 关闭 websocket
        }
        ws.onerror = function() {
          _this.$message.error('设备通讯连接已断开')
        }
      } else {
        // 浏览器不支持 WebSocket
        alert('您的浏览器不支持 WebSocket!')
      }
    },
    websocketMsgHandle(msg) {
      console.log(msg)
      if(msg.type === 13) {
        if(msg.fixed_type_list && msg.fixed_type_list.length > 0) {
          if(msg.fixed_type_list[0].equipmentId === this.roleInfoItem.id) {

            let item = deepClone(this.roleInfoItem)
            this.roleInfoItem = {}
            let dataParams = msg.fixed_type_list[0].panel_parameters

            // item.equ_power_supply_bias = dataParams.bias
            item.continuity = dataParams.continuity
            item.dark = dataParams.dark
            // item.equ_data_value_gain = dataParams.gain
            item.light_source = dataParams.light_source
            // item.equ_fill_lamp_voltage = dataParams.photovoltage
            item.record = dataParams.record
            item.reference = dataParams.reference
            item.sample = dataParams.sample
            // item.equ_shot_wave_integral = dataParams.shortwave_time
            item.timing = dataParams.timing
            item.timing_interval = dataParams.timing_interval
            // item.equ_visible_light_integral = dataParams.visible_light_time

            this.roleInfoItem = deepClone(item)
          }
        }
      }else if(msg.type === 100) {
        let showData = {}
        if(msg.equipment_type == '1') {
          showData = msg.fixed_type_list.length > 0 ? msg.fixed_type_list[0] : {}
        }
        if(Object.keys(showData).length > 0) {
          if(showData.equipmentId === this.roleInfoItem.id) {
            for(let i in showData.dataList) {
              let selectItem = {}
              selectItem.value = showData.dataList[i].value
              selectItem.name = showData.dataList[i].name
              selectItem.xData = showData.centralWavelength
              selectItem.yData = showData.dataList[i].arr
              this.chartInit(selectItem)
            }
          }
        }
      }else if(msg.type === 17) {
        this.realEquipmentList = msg.fixed_type_list ? msg.fixed_type_list : []
      }
    },
    doEquipOption(type) {
      if(this.roleInfoItem.timing == 1) {
        // 定时采集中
        return
      }
      if(this.realEquipmentList.length > 0) {
        if(this.getEquipmentStatus(this.roleInfoItem.id) !== 2) {
          if (type === 'dc' || type === 'lx' || type === 'ds') {
            if(!this.roleInfoItem.aid || this.roleInfoItem.aid === '') {
              this.$notify.error({
                title: '错误',
                message: "请先到【设备管理】关联算法后，再进行采集。"
              });
              return
            }
            if(type === 'ds' && this.startTime === '') {
              this.$notify.error({
                title: '错误',
                message: "请选择采集开始时间"
              });
              return
            }
            let nowTimes = parseInt(new Date().getTime() / 1000 / 60)
            let chooseTimes = parseInt(new Date(this.startTime).getTime() / 1000 / 60)
            if(type === 'ds' && chooseTimes < nowTimes) {
              this.$notify.error({
                title: '错误',
                message: "定时采集时间不可早于当前时间"
              });
              return
            }
          }
          //单次采集增加备注 ldc
          if(type === 'dc') {
            this.dcRemark = ''
            this.dcRemarkFlag = true
          }else if(type === 'ds') {
            this.$prompt('请输入备注', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消'
            }).then(({ value }) => {
              let msgJson = {
                username: this.username,
                snid: this.roleInfoItem.snid,
                type: type,
                seconds: this.seconds,
                version: this.roleInfoItem.version,
                remark: value ? value : ''
              }
              msgJson.times = this.singleTimes && this.singleTimes !== '' && this.singleTimes !== 0 ? this.singleTimes : 10
              msgJson.time = this.roleInfoItem.timing_interval
              if(this.kind === 'lx') {
                msgJson.count = 0
              }else {
                msgJson.count = this.times && this.times !== '' && this.times !== 0 ? this.times : 0
              }
              msgJson.startTime = this.startTime

              msgJson.xmTime = parseInt(msgJson.time) - 5
              msgJson.cjModel = this.cjModel

              this.ws.send(JSON.stringify(msgJson))
              this.$notify.success({
                title: "成功",
                message: "开始采集!",
              });
            })
          }else {
              this.$confirm('是否立即执行采集任务?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '再等等',
                type: 'warning'
              }).then(() => {
                let msgJson = {
                  username: this.username,
                  snid: this.roleInfoItem.snid,
                  type: type,
                  seconds: this.seconds,
                  version: this.roleInfoItem.version,
                  remark: ''
                }
                // 定标实现多次采集 取平均 ---- start 8月
                if(type !== 'adl' && type !== 'bzb') {
                  msgJson.times = this.singleTimes && this.singleTimes !== '' && this.singleTimes !== 0 ? this.singleTimes : 10
                }else {
                  if(type == 'adl') {
                    msgJson.dbTimes = this.adlTimes && this.adlTimes !== '' && this.adlTimes !== 0 ? this.adlTimes : 100
                  }else if(type == 'bzb') {
                    msgJson.dbTimes = this.bzbTimes && this.bzbTimes !== '' && this.bzbTimes !== 0 ? this.bzbTimes : 100
                  }
                }
                // 定标实现多次采集 聚类取平均 ---- end 8月
                if(type === 'ds') {
                  msgJson.time = this.roleInfoItem.timing_interval
                  if(this.kind === 'lx') {
                    msgJson.count = 0
                  }else {
                    msgJson.count = this.times && this.times !== '' && this.times !== 0 ? this.times : 0
                  }
                  msgJson.startTime = this.startTime
                }
                this.ws.send(JSON.stringify(msgJson))
                this.$notify.success({
                  title: "成功",
                  message: "开始采集!",
                });
              })
          }
        }else {
          this.$notify.error({
            title: '错误',
            message: "当前设备不在线"
          });
        }
      }else {
        this.$notify.error({
          title: '错误',
          message: "正在获取设备信息"
        });
      }
    },
    doDCCollect() {
      let msgJson = {
        username: this.username,
        snid: this.roleInfoItem.snid,
        type: 'dc',
        seconds: this.seconds,
        version: this.roleInfoItem.version,
        remark: this.dcRemark,
        times: this.singleTimes && this.singleTimes !== '' && this.singleTimes !== 0 ? this.singleTimes : 10
      }
      this.ws.send(JSON.stringify(msgJson))
      this.dcRemarkFlag = false
    },
    getEquipmentStatus(equipmentId) {
      let status = ''
      for(let i in this.realEquipmentList) {
        for(let j in this.realEquipmentList[i].list) {
          if(this.realEquipmentList[i].list[j].id === equipmentId) {
            status = this.realEquipmentList[i].list[j].on_type
            return status
          }
        }
      }
      return status
    },
    initEquipmentData() {
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + "admin/equipment/userarea",
        method: "post",
        data: {}
      }).then(res => {
        if (res.data.code === 200) {
          this.equTreeData = res.data.result
          this.equipData = []
          let currentDataItem = {}
          for(let i in this.equTreeData) {
            this.equTreeData[i].name = "(" + this.equTreeData[i].area_jc + ")" + this.equTreeData[i].area_name
            this.equTreeData[i].level = 1
            for(let j in this.equTreeData[i].list) {
              if(this.equTreeData[i].list[j].customizeName && this.equTreeData[i].list[j].customizeName !== '') {
                this.equTreeData[i].list[j].name = this.equTreeData[i].list[j].customizeName
              }else {
                this.equTreeData[i].list[j].name = this.equTreeData[i].list[j].equipmentname
              }
              this.equTreeData[i].list[j].level = 2
              for(let key in this.equTreeData[i].list[j].equipmentRecord) {
                //子表中的这些参数不正确，不加入主表。
                if(key === 'aid' || key === 'id' || key === 'eid' || key === 'snid' || key === 'equipment_type') {
                  continue
                }
                this.equTreeData[i].list[j][key] = this.equTreeData[i].list[j].equipmentRecord[key]
              }
              this.equipData.push(this.equTreeData[i].list[j])
              if(Object.keys(this.roleInfoItem).length > 0 && this.roleInfoItem.id === this.equTreeData[i].list[j].id){
                currentDataItem = this.equTreeData[i].list[j]
              }
            }
          }
          // this.equipDataStr = JSON.stringify(this.equipData)
          if(Object.keys(currentDataItem).length > 0) {
            this.roleInfoItem = deepClone(currentDataItem)
          }else {
            this.roleInfoItem = {}
          }
          // this.$nextTick(() => {
          //   this.$refs.equipmentOption_list.setChoiceRole(this.roleInfoItem)
          // })

        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    roloeItemChoose(item) {
      if(item.level === 1) {
        return
      }
      this.roleInfoItem = deepClone(item)
      // 1连续采集关，2连续采集开，3样品采集，4暗电流，5标准板，6定时关，7定时开
      if(this.roleInfoItem.collection_type == 1) {
        this.roleInfoItem.continuity = 2
      }else if(this.roleInfoItem.collection_type == 2) {
        this.roleInfoItem.continuity = 1
      }else if(this.roleInfoItem.collection_type == 6) {
        this.roleInfoItem.timing = 2
      }else if(this.roleInfoItem.collection_type == 7) {
        this.roleInfoItem.timing = 1
      }else if(this.roleInfoItem.collection_type == 8) {
        this.roleInfoItem.continuity = 2
        this.roleInfoItem.timing = 2
      }

      this.singleTimes = this.roleInfoItem.acquisition_density // times -> 采集密度
      if(this.roleInfoItem.timing_time && this.roleInfoItem.timing_time !== '') {
        let startTime = new Date(this.roleInfoItem.timing_time)
        this.startTime = startTime
      }else {
        this.startTime = ''
      }
      // this.startTime = this.roleInfoItem.timing_time // startTime -> 开始时间
      this.times = this.roleInfoItem.timing_bout // count -> 定时采集次数
      this.cjModel = this.roleInfoItem.cjModel ? this.roleInfoItem.cjModel : '01'

      if(this.times == 0) {
        this.kind = 'lx'
      }else {
        this.kind = 'cs'
      }

      // 获取设备参数信息（可见光积分、补光灯电压、短波积分、增益、偏压）LDC
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + "admin/equipment/infoBySid",
        method: "post",
        data: {
          snid: this.roleInfoItem.snid
        }
      }).then(res => {
        if(res.data.code == 200) {
          if(res.data.result.code && res.data.result.code == 400) {
            this.$notify.error({
              title: '错误',
              message: res.data.result.message
            });
            this.roleInfoItem.equ_visible_light_integral = 0
            this.roleInfoItem.equ_fill_lamp_voltage = 0
            this.roleInfoItem.equ_shot_wave_integral = 0
            this.roleInfoItem.equ_data_value_gain = 0
            this.roleInfoItem.equ_power_supply_bias = 0
            return
          }
          this.equipParam = res.data.result
          this.roleInfoItem.equ_visible_light_integral = res.data.result.visible_light_integral ? res.data.result.visible_light_integral : 0
          this.roleInfoItem.equ_fill_lamp_voltage = res.data.result.fill_lamp_voltage ? res.data.result.fill_lamp_voltage : 0
          this.roleInfoItem.equ_shot_wave_integral = res.data.result.shot_wave_integral ? res.data.result.shot_wave_integral : 0
          this.roleInfoItem.equ_data_value_gain = res.data.result.data_value_gain ? res.data.result.data_value_gain : 0
          this.roleInfoItem.equ_power_supply_bias = res.data.result.power_supply_bias ? res.data.result.power_supply_bias : 0

        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    stopBtnStatus() {
      if((this.roleInfoItem.continuity && this.roleInfoItem.continuity == '1') || (this.roleInfoItem.timing && this.roleInfoItem.timing == '1')) {
        return true
      }
      return false
    },
    stopCollect() {
      let msgJson = {}
      if(this.roleInfoItem.continuity && this.roleInfoItem.continuity == '1') {
        msgJson = {
          username: this.username,
          version: this.roleInfoItem.version,
          snid: this.roleInfoItem.snid,
          type: 'stop'
        }
      }else if(this.roleInfoItem.timing && this.roleInfoItem.timing == '1') {
        // msgJson = {
        //   username: this.username,
        //   snid: this.roleInfoItem.snid,
        //   type: 'ds',
        //   seconds: this.seconds,
        // }
        // msgJson.time = this.roleInfoItem.timing_interval
        // msgJson.count = -1
        // msgJson.startTime = utils.formatDate('yyyy-MM-dd hh:mm:ss',new Date())
        msgJson = {
          username: this.username,
          version: this.roleInfoItem.version,
          snid: this.roleInfoItem.snid,
          type: 'timeStop'
        }
      }
      this.ws.send(JSON.stringify(msgJson))
    },
    doEquipParamsSetting() {

      this.$confirm('请确认设备未进行采集任务。', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        //LDC 设备基本参数配置
        this.settingFlag = true

        let is_data_value_gain = '0'
        let is_fill_lamp_voltage = '0'
        let is_power_supply_bias = '0'
        let is_shot_wave_integral = '0'
        let is_visible_light_integral = '0'
        if(!this.equipParam.visible_light_integral || this.equipParam.visible_light_integral != this.roleInfoItem.equ_visible_light_integral) {
          is_visible_light_integral = '1'
        }
        if(!this.equipParam.fill_lamp_voltage || this.equipParam.fill_lamp_voltage != this.roleInfoItem.equ_fill_lamp_voltage) {
          is_fill_lamp_voltage = '1'
        }
        if(!this.equipParam.shot_wave_integral || this.equipParam.shot_wave_integral != this.roleInfoItem.equ_shot_wave_integral) {
          is_shot_wave_integral = '1'
        }
        if(!this.equipParam.data_value_gain || this.equipParam.data_value_gain != this.roleInfoItem.equ_data_value_gain) {
          is_data_value_gain = '1'
        }
        if(!this.equipParam.power_supply_bias || this.equipParam.power_supply_bias != this.roleInfoItem.equ_power_supply_bias) {
          is_power_supply_bias = '1'
        }

        this.$fetch({
          url: process.env.PROGOO_GATE_WATER + "admin/equipment/infoEdit",
          method: "post",
          data: {
            snid: this.roleInfoItem.snid,
            data_value_gain: this.roleInfoItem.equ_data_value_gain,
            fill_lamp_voltage: this.roleInfoItem.equ_fill_lamp_voltage,
            power_supply_bias: this.roleInfoItem.equ_power_supply_bias,
            shot_wave_integral: this.roleInfoItem.equ_shot_wave_integral,
            visible_light_integral: this.roleInfoItem.equ_visible_light_integral,
            is_data_value_gain: is_data_value_gain,
            is_fill_lamp_voltage: is_fill_lamp_voltage,
            is_power_supply_bias: is_power_supply_bias,
            is_shot_wave_integral: is_shot_wave_integral,
            is_visible_light_integral: is_visible_light_integral
          }
        }).then(res => {
          if(res.data.code == 200) {
            this.$message({
              message: '保存成功',
              type: 'success'
            });
            this.equipParam.visible_light_integral = this.roleInfoItem.equ_visible_light_integral
            this.equipParam.fill_lamp_voltage = this.roleInfoItem.equ_fill_lamp_voltage
            this.equipParam.shot_wave_integral = this.roleInfoItem.equ_shot_wave_integral
            this.equipParam.data_value_gain = this.roleInfoItem.equ_data_value_gain
            this.equipParam.power_supply_bias = this.roleInfoItem.equ_power_supply_bias
          }
          this.settingFlag = false
        })
      })
    },
    equipInfo() {
      let msgJson = {
        username: this.username,
        deviceSerial: [this.roleInfoItem.id],
        oilCommand: { //命令对象
          commandId: 'history', //命令id 1代表设备列表点击事件
          addedValue: '1', //命令值 1代表设备最新一次查询数据
          equipmentType: '1' // 1固定式设备 2移动设备 3无人船
        }
      }
      this.ws.send(JSON.stringify(msgJson))
    },
    openElLock() {
      this.$confirm('是否确认开启电磁锁？请避免误操作。（电磁锁开启后会在10秒后自动关闭）', '确认开启电磁锁', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let msgJson = {
          username: this.username,
          snid: this.roleInfoItem.snid,
          type: 'open',
        }
        this.ws.send(JSON.stringify(msgJson))
      })
    },
    chartInit(data) {
      let echarts = require('echarts')
      if(data.value === 'dnValue') {
        this.dnChart = echarts.init(this.$refs['dnChart'])
        this.dnChart.setOption({
          title: {
            text: 'dn值',
            x:'center',
            y:'top',
            textStyle: {
              color: '#C0FFFF'
            }
          },
          color: ['#9244E3'],
          tooltip: {
            trigger: 'axis'
          },
          grid: {
            left: '15%',
            bottom: '5%',
            top: '10%',
            height: '80%',
            right: '2%',
            show: true,
            backgroundColor: '#002738'
            // containLabel: true
          },
          xAxis: {
            type: 'category',
            axisLine: {
              lineStyle: {
                color: '#C0FFFF',
              }
            },
            axisLabel: {
              show: true,
              fontSize: 10
            },
            boundaryGap: false,
            data: data.xData
          },
          yAxis: {
            type: 'value',
            axisLine: {
              lineStyle: {
                color: '#C0FFFF'
              }
            },
            axisLabel: {
              show: true,
              fontSize: 10
            },
            splitLine: {
              lineStyle: {
                  color: ['#34697c']
              }
            },
            scale:true
          },
          series: [
            {
              name: data.name,
              type: 'line',
              stack: '总量',
              smooth: true,
              data: data.yData,
              areaStyle: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                  offset: 0,
                  color: 'rgba(146,68,227,0.3)'
                }, {
                  offset: 1,
                  color: '#9244E3'
                }])
              },
            }
          ]
        })
        this.$nextTick(() => {
          this.dnChart.resize()
        })
      }else if(data.value === 'reflectivity') {
        this.reflectivityChart = echarts.init(this.$refs['reflectivityChart'])
        this.reflectivityChart.setOption({
          title: {
            text: '反射率',
            x:'center',
            y:'top',
            textStyle: {
              color: '#C0FFFF'
            }
          },
          color: ['#9244E3'],
          tooltip: {
            trigger: 'axis'
          },
          grid: {
            left: '15%',
            bottom: '5%',
            top: '10%',
            height: '80%',
            right: '2%',
            show: true,
            backgroundColor: '#002738'
            // containLabel: true
          },
          xAxis: {
            type: 'category',
            axisLine: {
              lineStyle: {
                color: '#C0FFFF',
              }
            },
            axisLabel: {
              show: true,
              fontSize: 10
            },
            boundaryGap: false,
            data: data.xData
          },
          yAxis: {
            type: 'value',
            axisLine: {
              lineStyle: {
                color: '#C0FFFF'
              }
            },
            axisLabel: {
              show: true,
              fontSize: 10
            },
            splitLine: {
              lineStyle: {
                  color: ['#34697c']
              }
            },
            scale:true
          },
          series: [
            {
              name: data.name,
              type: 'line',
              stack: '总量',
              smooth: true,
              data: data.yData,
              areaStyle: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                  offset: 0,
                  color: 'rgba(146,68,227,0.3)'
                }, {
                  offset: 1,
                  color: '#9244E3'
                }])
              },
            }
          ]
        })
        this.$nextTick(() => {
          this.reflectivityChart.resize()
        })
      }
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
.equipmentOption{
  width: 100%;
  height: 100%;
  display: flex;
  flex-grow: 1;
  box-sizing: border-box;
  padding: 15px;
  overflow-y: scroll;
  .equipmentOption_treeBg {
    height: 100%;
    border: 1px solid #e4eaec;
    border-radius: 6px;
  }
  .equipmentOption_infoBg {
    height: 100%;
    box-sizing: border-box;
    padding: 0 7px;
    flex: 1;
  }
  .equipmentOption_info {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    border: 1px solid rgb(228, 234, 236);
    flex: 1;
    overflow-y: scroll;
    box-sizing: border-box;
    padding: 15px;
    .equipmentO_rightArea{
      .equipmentO_infoTitleBg {
        width: 100%;
        float: left;
        // margin-top: 20px;
        padding-bottom: 10px;
        border-bottom: 1px solid #e4e7ed;
        .equipmentO_infoTitle {
          font-size: 20px;
          float: left;
          height: 30px;
          line-height: 30px;
        }
        .equipmentO_delBtn {
          float: right;
        }
      }
      .equipmentO_info {
        width: 100%;
        float: left;
        padding-top: 10px;
        .equipmentO_infoLabel {
          color: #606266;
        }
        .equipmentO_formItem {
          display: flex;
          align-items: center;
        }
      }
      .equipmentO_eOptionArea {
        width: 100%;
        float: left;
        .equipmentO_eOptionAreaBg {
          width: 100%;
          float: left;
          display: flex;
          box-sizing: border-box;
          padding: 10px 0;
          .equipmentO_eImgArea {
            flex: 1;
            display: flex;
            justify-content: center;
            box-sizing: border-box;
            padding: 0 10px;
            align-items: flex-start;
            img {
              width: 100%;
            }
          }
          .equipmentO_option {
            flex: 4;
            box-sizing: border-box;
            .equipmentO_optionRow {
              margin-bottom: 12px;
              .equipmentO_optionCard {
                cursor: pointer;
                .equipmentO_optionCardBg {
                  width: 100%;
                  padding: 20px;
                  box-sizing: border-box;
                  display: flex;
                  .equipmentO_optionCardTitle {
                    display: inline-block;
                    vertical-align: middle;
                    margin-right: 10px;
                    flex: 1;
                  }
                }
              }
              .equipmentO_optionCardWhole {
                .equipmentO_optionCardBg {
                  width: 100%;
                  display: flex;
                  box-sizing: border-box;
                  padding-right: 20px;
                  align-items: center;
                  .equipmentO_optionCardTitle {
                    box-sizing: border-box;
                    padding: 20px 0 20px 20px;
                    display: inline-block;
                    vertical-align: middle;
                    margin-right: 10px;
                    flex: 1;
                    cursor: pointer;
                  }
                  .equipmentO_optionCardOption {
                    display: flex;
                    flex-direction: column;
                    flex: 1;
                    .equipmentO_optionCardOptionRowUp {
                      display: flex;
                      padding: 10px 0 5px;
                      .equipmentO_optionCardOptionCol {
                        flex: 1;
                      }
                    }
                    .equipmentO_optionCardOptionRowDown {
                      display: flex;
                      padding: 5px 0 10px;
                      .equipmentO_optionCardOptionCol {
                        flex: 1;
                      }
                    }
                  }
                }
              }
              .cardBg_o{
                background: #7FFFD4
              }
            }
          }
        }
      }
      .equipmentO_chartBg {
        width: 100%;
        float: left;
        height: 400px;
        .equipmentO_chartItem {
          width: 50%;
          float: left;
          height: 100%;
          box-sizing: border-box;
          padding: 10px;
        }
        .equipmentO_originalParamChart {
          width: 100%;
          height: 100%;
          float: left;
        }
      }
    }
  }
  .dialogFooter {
    display: flex;
    justify-content: center;
    margin-top: 0.5rem;
  }
}
</style>
